<template>
  <div class="c-p c-fs20 c-bg-white">
    <div class="c-w100 theme-bg-gradient c-hh190">
      <div class="c-pa c-p-t28 c-ph24 c-w100 clearfix">
        <div class="c-flex-row">
          <img :src="$addXossFilter(memberInfo.avatar, require('@/assets/defult_head.png'))" alt="" class="c-ww80 c-hh80 c-brp50" />
          <div class="c-fc-white c-pl20 c-w0 c-flex-grow1">
            <div class="c-flex-row c-aligni-center">
              <div class="c-fs30 c-text-ellipsis1 c-pr10 maxw240">{{ memberInfo.nickname }}</div>
              <identity-com :vipType="memberInfo.vipType"></identity-com>
            </div>
            <div class="c-flex-row c-justify-sb">
              <div class="c-pt10 c-w48">
                <div class="c-ws-n c-text-ellipsis1">真名:{{ !!memberInfo.realName ? memberInfo.realName : '--' }}</div>
                <div class="c-pt16">TEL:{{ !!memberInfo.mobile && allInfo.enableShowClassMatePhone == 1 ? memberInfo.mobile : '--' }}</div>
              </div>
              <div class="c-pt10 c-w48">
                <div class="c-ws-n c-text-ellipsis1">推荐人: {{ memberInfo.refereeName }}</div>
                <div class="c-pt16" @click="more">全部信息<span class="iconfont c-pl8 c-fs20">&#xe836;</span></div>
              </div>
            </div>
          </div>
        </div>

        <div class="c-bg-white c-br12 c-pv36 c-ph24 c-mt20 boxShow" v-if="setStaffTime && isShowSet">
          <div class="c-flex-row c-w100">
            <div class="c-fs22 c-fc-xblack c-w100 c-flex-row c-justify-sb c-aligni-center">
              <div class="">设置为员工:</div>
              <div v-if="!!setStaffTime">
                <template v-if="stringValue == 1">
                  <div class="c-fs18 c-p">
                    <div class="c-ww300 c-hh30 c-lh30 c-bg-f2 c-br4"></div>
                    <div class="c-pa c-p-l10 c-p-t2 c-fc-sgray c-flex-row c-aligni-center"><i class="iconfont c-pr5 c-fs18">&#xe6b1;</i>{{ setStaffTime }}设为员工</div>
                  </div>
                </template>
                <template v-else>
                  <div class="c-fs18 c-p">
                    <div class="c-ww300 c-hh30 c-lh30 c-bg-green c-opacity10 c-br4"></div>
                    <div class="c-pa c-p-l10 c-p-t2 c-fc-green c-flex-row c-aligni-center"><i class="iconfont c-pr5 c-fs18">&#xe6b1;</i>{{ setStaffTime }}取消员工</div>
                  </div>
                </template>
              </div>
              <x-switch :themeColor="$getThemeColor()" title="" :value-map="[0, 1]" v-model="stringValue" prevent-default @on-click="changeSwitch"></x-switch>
            </div>
          </div>
          <div class="c-fs22 c-fc-xblack c-pt28 c-w100 c-flex-row c-justify-sb c-aligni-center" v-if="isShowSet || stringValue == 1">
            <div class="c-w60">员工奖学金:</div>
            <div class="c-w40 c-flex-row c-aligni-center c-textAlign-r">
              <input
                type="number"
                step="0.01"
                min="0"
                @keyup="num = num.match(/\d+(\.\d{0,2})?/) ? num.match(/\d+(\.\d{0,2})?/)[0] : ''"
                class="c-w40 c-fs24 c-lh c-textAlign-c needsclick bd-bd1"
                @focus="inputFocus"
                ref="input"
                v-model="num"
              />%
              <div class="c-w60 c-textAlign-r">
                <button class="c-w80 c-bd0 theme-bg c-fs20 c-fc-white c-pv10 c-ph24 c-lh c-br24 c-ws-n c-textAlign-c" @click="setStaff(1)">提交</button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- //数据统计/行为统计 -->
    <div class="c-pv20 c-ph24 bg-gray">
      <my-small-tabbar :tabList="tabList" :tabIndex="tabIndex" :flexClass="'c-justify-start'" :isScroll="true" @changeTab="changeLevel"></my-small-tabbar>
    </div>
    <!-- //tab -->
    <div class="c-flex-row c-ph24">
      <div
        v-for="(item, index) in tabList1"
        :key="index"
        class="c-pv10 c-ww140 c-fs20 c-textAlign-c c-mr8 c-br4"
        :class="tabIndex1 == item.index ? 'theme-bg c-fc-white' : 'c-bg-f2'"
        @click="changeNum(item.index)"
      >
        {{ item.title }}
      </div>
    </div>
    <!-- //数据统计 -->
    <div v-if="tabIndex == 1" class="c-ph24">
      <!-- //统计 -->
      <div class="c-bg-white c-ph20 c-pv40 c-br12 shadow1 c-mt28">
        <div class="c-flex-row c-bd-b1-f6 c-pb24">
          <div class="c-w33 c-mr4">
            <div class="c-fs26 c-textAlign-l c-lh36">{{ classAnalyseData.consumeMoney || 0 }}</div>
            <div class="c-fs20 c-textAlign-l c-fc-gray c-lh28 c-mt4">消费总额(元)</div>
          </div>
          <div class="c-w33 c-mr4">
            <div class="c-fs26 c-textAlign-l c-lh36">{{ classAnalyseData.visitTimes || 0 }}</div>
            <div class="c-fs20 c-textAlign-l c-fc-gray c-lh28 c-mt4">访问次数</div>
          </div>
          <div class="c-w33">
            <div class="c-fs26 c-textAlign-l c-lh36">{{ classAnalyseData.shareTimes || 0 }}</div>
            <div class="c-fs20 c-textAlign-l c-fc-gray c-lh28 c-mt4">分享次数</div>
          </div>
        </div>

        <div class="c-flex-row c-pt24">
          <div class="c-w33 c-mr4">
            <div class="c-fs26 c-textAlign-l c-lh36">{{ classAnalyseData.consumeTimes || 0 }}</div>
            <div class="c-fs20 c-textAlign-l c-fc-gray c-lh28 c-mt4">消费次数</div>
          </div>
        </div>
      </div>
    </div>
    <!-- 行为统计 -->
    <div v-if="tabIndex == 2" class="c-ph24 c-pt30">
      <div v-if="tabIndex1 == 4">
        <div class="theme-bd-l1 c-pb30 c-ml12 c-pl30 c-p" v-for="(sItem, sIndex) in accessBehavio" :key="sIndex">
          <div v-if="!$isWxAppIos()" class="c-fs20 c-fc-gray c-pv10">{{ sItem.payAt }} 购买</div>
          <div class="boxShow c-br10 c-mt20 c-ph20 c-fc-xblack">
            <div v-for="(item, index) in sItem.orderDetail" :key="index">
              <div class="c-ww24 c-hh24 c-pa c-p-t10 c-p-l0 c-translate-x-50">
                <div class="c-ww24 c-hh24 c-brp50 theme-bg c-opacity10"></div>
                <div class="theme-bg c-ww12 c-hh12 c-brp50 c-pa c-p-tp50 c-p-tl50 c-translate-xy-50"></div>
              </div>
              <div class="c-p">
                <div class="c-flex-row c-pv20">
                  <img :src="$addXossFilter(item.avatar, require('../../../assets/i/wap/common/default.jpg'))" alt="" class="c-br10 c-ww180 c-hh120" />
                  <div class="c-ml20 c-flex-grow1 c-w0">
                    <div class="c-fs24 c-fw500 c-lh34 c-text-ellipsis2" v-if="item.goodsName">{{ item.goodsName || '未知' }}</div>
                    <div class="c-fs20 c-pa c-p-b30 c-p-l200 c-flex-row c-aligni-center c-justify-sb c-w60">
                      <span class="">￥{{ item.price }}</span>
                      <span class=""><span class="c-fs18">x</span>{{ item.quantity }}</span>
                    </div>
                  </div>
                </div>
              </div>
              <div class="c-fs20 c-textAlign-r c-flex-row c-aligni-center c-justify-end c-mb20">
                <div class="c-p c-fs18 c-ww104 c-hh40 c-lh40 c-textAlign-c" v-if="item.tag">
                  <div class="c-pa c-p-t0 c-p-l0 theme-bg c-opacity10 c-br20 c-w100 c-h"></div>
                  <div class="c-pa c-p-t0 c-p-l0 theme-fc c-w100 c-h">{{ item.tag }}</div>
                </div>
                <span class="c-pl14"
                >推广收益:<span class="c-fc-red">￥{{ item.income || 0 }}</span></span
                >
              </div>
            </div>
            <div class="c-pv30 c-textAlign-r c-bd-t1-f6 c-fs20">
              <div>
                实际付款:<span>￥{{ sItem.payMoney }}</span>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div v-else>
        <div class="theme-bd-l1 c-pb30 c-ml12 c-p" v-for="(item, index) in accessBehavio" :key="index">
          <div class="c-ww24 c-hh24 c-pa c-p-t10 c-p-l0 c-translate-x-50">
            <div class="c-ww24 c-hh24 c-brp50 theme-bg c-opacity10"></div>
            <div class="theme-bg c-ww12 c-hh12 c-brp50 c-pa c-p-tp50 c-p-tl50 c-translate-xy-50"></div>
          </div>
          <div class="c-pl30 c-pv10">
            <div class="c-fs20 c-fc-gray c-lh30">
              <span>{{ item.time }}</span>
              <span v-if="item.sid">通过（分享人：{{item.sNickname}} ID：{{item.sid}}）的链接</span>
              <span>{{ tabIndex1 == 1 ? '访问了' : tabIndex1 == 2 ? '观看了' : '购买了' }}</span>
              <span class="theme-fc">{{ item.prodType | filterProdType(item.prodCourseType) }}</span>
              <span v-if="tabIndex1 == 1">，浏览时长为</span>
              <span v-if="tabIndex1 == 1" class="theme-fc">{{!item.duration ? '0.01' : (item.duration / 60).toFixed(2)}}分钟</span>
            </div>
            <div class="shadow1 c-ph20 c-br10 c-mt20">
              <div class="c-flex-row c-pv20" :class="tabIndex1 != 1 ? 'c-bd-b1-f6' : ''">
                <img :src="$addXossFilter(item.cover)" alt="" class="c-br10 c-ww180 c-hh120" />
                <div class="c-ml20 c-flex-grow1 c-w0">
                  <div class="c-fs24 c-fw500 c-textAlign-l c-lh34 c-wb-ba" v-if="item.name">{{ item.name }}</div>
                  <div class="c-fs20 c-mt16">
                    <span v-if="tabIndex1 == 3 || tabIndex1 == 4">销售价：</span>
                    <span>{{ item.priceStr }}</span>
                  </div>
                  <div class="c-fs20 c-mt16" v-if="tabIndex1 == 3 || tabIndex1 == 4">实付：<span>￥</span>{{ item.payMoney || 0 }}</div>
                </div>
              </div>
              <div v-if="tabIndex1 == 3 || tabIndex1 == 4" class="c-pv15 c-flex-row c-justify-sb">
                <div class="c-fs20">{{ item.tag }}</div>
                <div class="c-fs20 c-fc-gray">
                  推广收益<span class="c-fs22 c-fc-red">&nbsp;<span>￥</span>{{ item.income || 0 }}</span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <loading-status-tem :dataStatus="dataStatus" :noDataText="'暂无记录'"></loading-status-tem>
    </div>
    <div class="masker" v-if="isShowMasker" @click="closeMasker"></div>
    <open-modal :openModal="openModal" @closeModal="closeModal">
      <div class="c-ph24 c-bg-white c-pz1000 c-br-tr10 c-br-tl10 c-pb40 c-fc-xblack c-fs22">
        <div class="c-fs28 c-fw-b c-textAlign-c c-pt30 c-fc-xblack c-p">
          全部信息
          <span class="iconfont c-fs18 c-fc-gray c-pa c-p-t40 c-p-r8" @click="closeModal">&#xe8fd;</span>
        </div>
        <div class="c-pv24 c-bd-b1"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">姓名</span>{{ memberInfo.nickname }}</div>
        <div class="c-pv24 c-bd-b1" v-if="!!memberInfo.realName"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">真名</span>{{ memberInfo.realName }}</div>
        <div class="c-pv24 c-bd-b1">
          <div class="c-ww180 c-pr40 c-inlineblack c-fc-gray">身份:</div>
          <span>{{ custNameMap[`${memberInfo.vipType}`] }}</span>
        </div>
        <div class="c-pv24 c-bd-b1" v-if="memberInfo.vipType == 2 || memberInfo.vipType == 4">
          <span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">会员到期时间</span>{{ memberInfo.vipType == 2 ? memberInfo.vipEndTime : memberInfo.svipEndTime }}
        </div>
        <div class="c-pv24 c-bd-b1"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">推荐人</span>{{ memberInfo.refereeName }}</div>
        <div class="c-pv24 c-bd-b1"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">ID</span>{{ memberInfo.userId }}</div>
        <div class="c-pv24 c-bd-b1" v-if="!!memberInfo.mobile && allInfo && allInfo.enableShowClassMatePhone">
          <span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">TEL</span>{{ memberInfo.mobile }}
        </div>
        <div class="c-pv24 c-bd-b1" v-if="!!memberInfo.mobile && !!memberInfo.bindMobileAt"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">手机绑定时间</span>{{ memberInfo.bindMobileAt }}</div>
        <div class="c-pv24 c-bd-b1 theme-fc"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">最近活跃</span>{{ memberInfo.activeTime }}</div>
        <div class="c-pv24 c-bd-b1" v-if="!!memberInfo.bindAt"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">绑定时间</span>{{ memberInfo.bindAt }}</div>
        <div class="c-pv24 c-bd-b1" v-if="memberInfo.expirationDate"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">绑定到期</span>{{ memberInfo.expirationDate }}</div>
        <div class="c-pv24 c-bd-b1" v-if="!!memberInfo.createdAt"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">注册时间</span>{{ memberInfo.createdAt }}</div>
        <div class="c-pv24" :class="!!memberInfo.province ? 'c-bd-b1' : ''"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">注册来源</span>{{ fromChannelTxt }}</div>
        <div class="c-pv24" v-if="!!memberInfo.province"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">地址</span>{{ memberInfo.province }}{{ memberInfo.city }}{{ memberInfo.area }}</div>
      </div>
    </open-modal>
    <my-loading :showLoading="isLoading"></my-loading>
  </div>
</template>

<script>
import loadingStatusTem from '@/components/templates/common/loadingStatusTem.vue';
import { XSwitch } from 'ckjrweb-mp-ui/src/components/index';
import { utilJs } from '@/utils/common.js';
import { LOAD_STATUS_ENUM } from '@/utils/constant.js';
import openModal from '@/components/templates/common/openModal.vue';
import MySmallTabbar from '@/components/templates/common/MySmallTabbar.vue';
import myLoading from '@/plugin/loading/loading.vue';
import identityCom from '@/components/templates/common/identityCom.vue';
const VIP_DEFAULT_IMG = require('@/assets/i/wap/course/vip.png');
const SVIP_DEFAULT_IMG = require('@/assets/i/wap/course/svip.png');
const AGUMENT_DEFAULT_IMG = require('@/assets/agentApply.png');
const ALL_DEFAULT_IMG = require('@/assets/i/wap/common/default.jpg');

const TAB_LIST = [
  {
    title: '数据统计',
    index: 1
  },
  {
    title: '行为统计',
    index: 2
  }
];
const DATA_TAB_LSIT = [
  {
    title: '7天',
    index: 1
  },
  {
    title: '本月',
    index: 2
  },
  {
    title: '今年',
    index: 3
  }
];
const BEHAVIOR_TAB_LIST = [
  {
    title: '访问行为',
    index: 1
  },
  {
    title: '知识购买行为',
    index: 3
  },
  {
    title: '商城购买行为',
    index: 4
  }
];
const LIMIT = 100;
let analyseDataOne = {};
let analyseDataTwo = {};
let analyseDataThree = {};
export default {
  name: 'ClassmatesDetail',
  components: {
    XSwitch,
    openModal,
    MySmallTabbar,
    loadingStatusTem,
    myLoading,
    identityCom
  },
  props: [],
  data() {
    return {
      classAnalyseData: {}, // 数据统计
      accessBehavio: {}, // 行为统计
      theme: localStorage.getItem('colorName') ? localStorage.getItem('colorName') : 'mb5_default',
      stringValue: 0,
      num: 0, // 员工奖学金
      memberInfo: '',
      vipType: '',
      setStaffTime: '',
      gender: '',
      isShowSet: false,
      memberId: '',
      svShow: false,
      svipRemainingQuota: 0,
      vipRemainingQuota: 0,
      isClick: false, // 是否提交
      companyAuth: JSON.parse(localStorage.getItem('companyAuth')),
      isShowMasker: false, //显示遮罩层
      openModal: false, //显示全部信息
      tabList: TAB_LIST,
      tabIndex: 1,
      dataTabList: DATA_TAB_LSIT,
      tabIndex1: 1,
      custNameMap: {},
      prodMapType: global.prodMapType,
      prodCourseTypeMap: global.prodCourseType,
      dataStatus: LOAD_STATUS_ENUM.HAS_MORE_DATA,
      page: 1,
      cfrom: global.ckFrom,
      // isShowMobile:false, //是否显示手机号
      isLoading: false,
      allInfo: {}
    };
  },
  created() {
    utilJs.appShare(this);
  },
  computed: {
    fromChannelTxt() {
      let fromChannel = this.memberInfo.fromChannel;
      const FROM_CHANNEL_MAP = {
        1: '公众号',
        2: '小程序',
        3: '安卓APP',
        4: '苹果APP',
        5: 'web/pc',
        10: '抖音',
        14: '抖音',
        13: '手机号注册',
        127: '手机号注册',
        20: '手动导入',
        30: '视频号小店'
      };
      return FROM_CHANNEL_MAP[fromChannel] || '未知';
    }
  },
  filters: {
    filterProdType(prodType, prodCourseType) {
      if (prodType == 5) {
        return global.prodCourseType[prodCourseType];
      } else {
        return global.prodMapType[prodType];
      }
    }
  },
  watch: {
    memberId() {
      this.getMemberInfo();
    },
    num(val) {
      // 监听员工奖学金
      if (isNaN(val)) {
        this.num = null;
      } else {
        this.num = val;
      }
    }
  },
  methods: {
    more() {
      this.isShowMasker = true;
      this.openModal = true;
    },
    //二级选择
    changeNum(num) {
      if (this.tabIndex == 1) {
        this.tabIndex1 = num;
        this.getClassMateData();
      } else {
        if (this.dataStatus == LOAD_STATUS_ENUM.LOADING) {
          return;
        }
        this.page = 1;
        this.accessBehavio = [];
        this._loadVersion = 'v2'
        this.getAccessBehavio(num);
        this.tabIndex1 = num;
      }
    },
    closeMasker() {
      this.isShowMasker = false;
      this.openModal = false;
    },
    closeModal() {
      this.openModal = false;
      this.isShowMasker = false;
    },
    // 一级选择
    changeLevel(num) {
      this.tabIndex = num;
      this.tabIndex1 = 1;
      this.page = 1;
      if (num == 2) {
        this.tabList1 = BEHAVIOR_TAB_LIST;
      } else {
        this.tabList1 = DATA_TAB_LSIT;
      }
      if (num == 1) {
        this.getClassMateData();
      } else {
        this.accessBehavio = [];
        this._loadVersion = 'v2'
        this.getAccessBehavio(1);
      }
    },
    // 获取统计
    getClassMateData() {
      if (Object.keys(analyseDataOne).length != 0 && Object.keys(analyseDataTwo).length != 0 && Object.keys(analyseDataThree).length != 0) {
        if (this.tabIndex1 == 1) {
          this.classAnalyseData = analyseDataOne;
        } else if (this.tabIndex1 == 2) {
          this.classAnalyseData = analyseDataTwo;
        } else {
          this.classAnalyseData = analyseDataThree;
        }
      } else {
        this.classAnalyseData = 0;
        if (this.isLoading) {
          return;
        }
        this.isLoading = true;
        utilJs.getMethod(global.apiurl + `Analyse/classMateData/${this.memberId}?timeType=${this.tabIndex1}`, res => {
          this.isLoading = false;
          this.classAnalyseData = res.data;
          if (this.tabIndex1 == 1) {
            analyseDataOne = res.data;
          } else if (this.tabIndex1 == 2) {
            analyseDataTwo = res.data;
          } else {
            analyseDataThree = res.data;
          }
        });
      }
    },
    getAccessBehavio(beve) {
      //获取行为统计列表
      if (beve == 1) {
        this.getViewBehavior();
        return;
      }
      if (beve == 2) {
        this.getWatchBehavior();
        return;
      }
      this.dataStatus = LOAD_STATUS_ENUM.LOADING;
      // 购买行为
      let buType = beve == 4 ? 2 : 1; //type  =1 是知识商品，2商城商品
      let url = `Analyse/buyBehavior/${this.memberId}?type=${buType}&page=${this.page}`;
      utilJs.getMethod(
        `${global.apiurl}${url}`,
        res => {
          let resList = res.data.data || [];
          this.resetBehaviorList(resList);
        },
        failRes => {
          this.dataStatus = LOAD_STATUS_ENUM.DATA_ERROR;
        }
      );
    },
    //观看行为统计
    getWatchBehavior() {
      this.dataStatus = LOAD_STATUS_ENUM.LOADING;
      let url = `Analyse/watchBehavior/${this.memberId}?page=${this.page}`;
      utilJs.getMethod(
        `${global.apiurl}${url}`,
        res => {
          let resList = res.data.data || [];
          this.resetBehaviorList(resList);
        },
        failRes => {
          this.dataStatus = LOAD_STATUS_ENUM.DATA_ERROR;
        }
      );
    },
    //行为轨迹统计
    getViewBehavior() {
      this.dataStatus = LOAD_STATUS_ENUM.LOADING;
      //最后一个元素是v2 || 数据为空，则代表还要继续取v2的数据
      let url = `Analyse/accessBehavior/${this.memberId}?page=${this.page}&limit=${LIMIT}&version=${this._loadVersion}`;
      utilJs.getMethod(
        `${global.apiurl}${url}`,
        res => {
          let resList = res.data.data || [];
          this.resetBehaviorList(resList);
          //v2新版的行为统计请求完，需要请求下旧版的行为统计
          if (this._loadVersion == 'v2' && this.dataStatus == LOAD_STATUS_ENUM.NO_MORE_DATA) {
            this._loadVersion = 'v1'
            this.page = 1;
            this.getViewBehavior();
          }
        },
        failRes => {
          this.dataStatus = LOAD_STATUS_ENUM.DATA_ERROR;
        }
      );
    },
    isAgent(prodType) {
      const agentList = [
        this.cfrom.agentApply,
        this.cfrom.partnerApply,
        this.cfrom.branchApply,
        this.cfrom.cooApply,
        this.cfrom.agencyApply,
        this.cfrom.agent6Apply,
        this.cfrom.agent7Apply,
        this.cfrom.agent8Apply,
        this.cfrom.agent9Apply
      ];
      if (agentList.includes(prodType)) {
        return true;
      }
      return false;
    },
    resetBehaviorList(resList) {
      for (let item of resList) {
        //vip会员类型
        if (item.prodType == 1) {
          item.cover = VIP_DEFAULT_IMG;
          item.name = 'VIP';
          item.price = '';
        }
        //svip会员类型
        if (item.prodType == 23) {
          item.cover = SVIP_DEFAULT_IMG;
          item.name = 'SVIP';
          item.price = '';
        }
        //服务商类型
        if (this.isAgent(item.prodType)) {
          item.cover = AGUMENT_DEFAULT_IMG;
          item.name = '服务商';
          item.price = '';
        }
        item.cover = item.cover || ALL_DEFAULT_IMG;
        //由于后台免费的情况默认会返回price:'0.00',所以优先判断payType == 1 显示免费 payType == 3显示加密 , 有价格显示价格 其他情况不显示
        item.priceStr = item.payType == 1 ? '免费' : item.payType == 3 ? '加密' : item.price ? `￥${item.price}` : '';
      }
      //如果是行为统计 && 加载的是v1版本的 && 有v2的数据的 -》把page重置为不是1，否则会默认把旧数据情况
      let oldPage = this.page;
      if (this.tabIndex1 == 1 && this._loadVersion == 'v1' && this.accessBehavio.length) {
        this.page = 2;
      }
      const { list, loadStatus } = utilJs.formatListData(this.page, LIMIT, resList, this.accessBehavio);
      this.accessBehavio = list;
      this.dataStatus = loadStatus;
      this.page = oldPage;
      if (this.dataStatus == LOAD_STATUS_ENUM.HAS_MORE_DATA) {
        this.page++;
      }
    },
    // -------以上是新加的
    changeSwitch(val) {
      // if (val) {
      //   if (this.vipRemainingQuota == 0 && this.svipRemainingQuota == 0) {
      //     this.$showCjToast({
      //       text: "没有赠送名额不能设置员工",
      //       type: 'warn',
      //       time: 1500
      //     });
      //     this.stringValue = 0
      //     return;
      //   }
      //   this.stringValue = 1
      //   this.setStaff(0);
      // } else {
      //   this.stringValue = 0
      //   this.num = 0
      //   this.setStaff(0);
      // }
      if (val) {
        this.stringValue = 1;
      } else {
        this.stringValue = 0;
        this.num = 0;
      }
      this.setStaff(0);
    },
    inputFocus() {
      this.num = '';
    },
    setStaff(isSubmit) {
      let isStaff;
      if (this.stringValue <= 0) {
        isStaff = false;
      } else {
        isStaff = true;
      }
      if (Number(this.num) > 0 && this.stringValue < 1) {
        this.$showCjToast({
          text: '请先设置成员工再设置员工奖学金！',
          type: 'warn',
          time: 1500
        });
        this.num = 0;
        return;
      }
      // if (this.vipRemainingQuota == 0 && this.svipRemainingQuota == 0) {
      //   this.$showCjToast({
      //     text: "没有赠送名额不能设置员工奖学金",
      //     type: 'warn',
      //     time: 1500
      //   });
      //   this.num = 0
      //   return;
      // }
      // 后台开启按现金百分比 就要判断设置的员工比例不能小于升级VIP第一级抽成比例
      if (this.memberInfo.ratioType == 1 && isStaff) {
        // 判断取哪个比例 VIP svip哪个有值取哪个
        let ratio = this.memberInfo.upgradeMembershipL1Ratio > 0 ? this.memberInfo.upgradeMembershipL1Ratio : this.memberInfo.upgradeSvipL1Ratio;
        // 设置员工时默认给第一级分销比例
        this.num = this.num > 0 ? this.num : isSubmit == 0 ? ratio : 0;
        // 判断
        if (this.num < 0) {
          this.$showCjToast({
            text: '员工的抽成比例不能低于0',
            type: 'warn',
            time: 2000
          });
          return;
        }
        const userId = localStorage.getItem('userId');
        const vipType = localStorage.getItem(`vipType${userId}`);
        const {
          newAgencyUpgradeMembershipL1Ratio = 0,
          newCooUpgradeMembershipL1Ratio = 0,
          newAgentUpgradeMembershipL1Ratio = 0,
          newPartnerUpgradeMembershipL1Ratio = 0,
          newBranchUpgradeMembershipL1Ratio = 0,
          isCustomStaff = 0
        } = this.memberInfo;
        localStorage.getItem('companyId');
        let isCorrectNum = true;
        let maxRatio = 0;
        // 定制商家 员工分成比例不能大于推荐人身份所能获得的第一级分成比例
        if ([3, 5, 6, 7, 8].includes(vipType) && isCustomStaff) {
          const vipAction = {
            3: () => {
              if (this.num > newAgentUpgradeMembershipL1Ratio) {
                isCorrectNum = false;
                maxRatio = newAgentUpgradeMembershipL1Ratio;
              }
            },
            5: () => {
              if (this.num > newPartnerUpgradeMembershipL1Ratio) {
                isCorrectNum = false;
                maxRatio = newPartnerUpgradeMembershipL1Ratio;
              }
            },
            6: () => {
              if (this.num > newBranchUpgradeMembershipL1Ratio) {
                isCorrectNum = false;
                maxRatio = newBranchUpgradeMembershipL1Ratio;
              }
            },
            7: () => {
              if (this.num > newCooUpgradeMembershipL1Ratio) {
                isCorrectNum = false;
                maxRatio = newCooUpgradeMembershipL1Ratio;
              }
            },
            8: () => {
              if (this.num > newAgencyUpgradeMembershipL1Ratio) {
                isCorrectNum = false;
                maxRatio = newAgencyUpgradeMembershipL1Ratio;
              }
            }
          };
          vipAction[vipType]();
          if (!isCorrectNum) {
            this.$showCjToast({
              text: `设置的比例值不能高于${maxRatio}%`,
              type: 'warn',
              time: 1500
            });
            return;
          }
        }
        if (this.num > 100) {
          this.$showCjToast({
            text: '员工的抽成比例不能大于100%',
            type: 'warn',
            time: 1500
          });
          return;
        }
      } else if (this.memberInfo.ratioType == 2 && isStaff) {
        // 后台开启按积分值 就直接判断员工比例在0-100之间
        if (this.num < 0 || this.num > 100) {
          this.$showCjToast({
            text: '范围在0-100之间的整数',
            type: 'warn',
            time: 1500
          });
          return;
        }
      }
      if (this.isClick) {
        return;
      }
      this.isClick = true;
      let $this = this;
      utilJs.postMethod(global.apiurl + 'members/setStaff', { userId: this.memberInfo.userId, isStaff: isStaff, staffRatio: this.num * 1, isSubmit: isSubmit }, res => {
        this.$showCjToast({
          text: '设置成功',
          type: 'success',
          time: 1500,
          isShowMask: 'true'
        });
        $this.setStaffTime = res.setStaffTime;
        $this.isClick = false;
      });
    },
    getMemberInfo() {
      let $this = this;
      // this.memberId = this.$route.query.memberId;
      utilJs.getMethod(global.apiurl + 'members/followerDetail?userId=' + this.memberId, function(res) {
        $this.vipRemainingQuota = res.vipRemainingQuota; // vip赠送名额
        $this.svipRemainingQuota = res.svipRemainingQuota; // svip赠送名额
        $this.memberInfo = res.info;
        $this.allInfo = res;
        // $this.isShowMobile = res.showMobile;
        $this.setStaffTime = res.info.setStaffTime;
        $this.companyAuth = JSON.parse(localStorage.getItem('companyAuth'));
        $this.vipType = $this.custNameMap[res.vipType];
        $this.gender = res.info.gender == 1 ? '男' : res.info.gender == 2 ? '女' : '未知';
        $this.stringValue = res.info.isStaff;
        $this.num = res.info.staffRatio;
        $this.isShowSet = false;
        let timeEnd = 0;
        let vEnd = 0;
        let sEnd = 0;
        if (res.info.vipEndTime != null && res.info.vipEndTime != '') {
          let stringTime = res.info.vipEndTime.replace(/-/g, '/');
          let timestamp = Date.parse(new Date(stringTime));
          timestamp = timestamp / 1000;
          vEnd = timestamp;
        } else if (res.info.svipEndTime != null && res.info.svipEndTime != '') {
          let stringTime = res.info.svipEndTime.replace(/-/g, '/');
          let timestamp = Date.parse(new Date(stringTime));
          timestamp = timestamp / 1000;
          sEnd = timestamp;
        }
        timeEnd = vEnd >= sEnd ? vEnd : sEnd;
        let nowTime = new Date().getTime();
        nowTime = nowTime / 1000;
        $this.svShow = nowTime > timeEnd ? true : res.info.vipType == 1;
      });
    },
    //分享
    wechatShare: function() {
      utilJs.wechatConfig('', '', '', '',);
    },
    //手机端分享
    appShare: function() {
      utilJs.appShareTrue('', '', '', '');
    },
    windowScrollFunction() {
      utilJs.handleLoading(() => {
        if (this.dataStatus == LOAD_STATUS_ENUM.LOADING) {
          return;
        } else if (this.dataStatus == LOAD_STATUS_ENUM.HAS_MORE_DATA && this.accessBehavio.length > 0) {
          this.getAccessBehavio(this.tabIndex1);
        }
      });
    }
  },
  activated() {
    setDocumentTitle('用户详情'); // eslint-disable-line
    this.svShow = false;
    this.dataStatus = LOAD_STATUS_ENUM.HAS_MORE_DATA;
    this.custNameMap = utilJs.getCustNameMap();
    this.tabIndex = 1;
    this.tabIndex1 = 1;
    this.page = 1;
    this._loadVersion = 'v2';
    this.isLoading = false;
    analyseDataOne = {};
    analyseDataTwo = {};
    analyseDataThree = {};
    this.allInfo = {};
    this.tabList = TAB_LIST;
    this.tabList1 = DATA_TAB_LSIT;
    let teamId = localStorage.getItem('memberUserId');
    this.memberId = this.$route.query.memberId ? this.$route.query.memberId : teamId;
    if (this.$route.query.memberId) {
      localStorage.setItem('memberUserId', this.memberId);
    } else if (!this.$route.query.memberId && !localStorage.getItem('memberUserId')) {
      this.$routerGo(this, 'replace', { path: '/' });
    }
    if (this.$route.query.memberId || localStorage.getItem('memberUserId')) {
      this.getMemberInfo();
      this.getClassMateData();
      this.wechatShare();
    }
    window.addEventListener('scroll', this.windowScrollFunction);
  },
  deactivated() {
    this.isShowSet = false;
    this.memberInfo = {};
    this.dataStatus = LOAD_STATUS_ENUM.NO_MORE_DATA;
    window.removeEventListener('scroll', this.windowScrollFunction);
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.weui-cell_switch {
  padding: 0 0 !important;
}
.bg-set-time {
  background: rgba(4, 190, 5, 0.04);
  border-radius: 0.1rem;
  color: #5ab558;
  font-size: 0.6rem;
}
.weui-switch,
.weui-switch-cp__box {
  background-color: #ccc;
}
.boxShow {
  box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.05);
}
.clearfix:after {
  content: '020';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  /* 触发 hasLayout */
  zoom: 1;
}
.bd-bd1 {
  border: none;
  border-bottom: 1px solid #999;
}
.shadow1 {
  box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.05);
}
.maxw240 {
  max-width: 6rem;
}
</style>
